<%@ taglib uri="http://www.springframework.org/tags/form" prefix="form"%>
<%@ taglib uri="http://java.sun.com/jstl/core_rt" prefix="c"%>

<div class="with-head">
	<div class="with-padding" style="height: 100%; overflow: auto; color: Black;">
		<div>
			<div class="block-border" style="background-color: #efefef;">
				<div class="block-content">
					<h1>
						<span>${requestScope.position.positionId == 0 ? 'Add' : 'Edit'} Position</span>
					</h1>
					<div class="block-controls">
						<ul class="controls-tabs  same-height with-children-tip">
							<li>
								<a title="Add" href="${contextPath}/setupPositionForm.ems">
									<img src="${imagePath}/add.png"> 
								</a>
							</li>
							<li>
								<a title="Edit" href="javascript:getPositionDetails('${applicationScope.contextPath}','positionSelectBoxId')">
									<img src="${imagePath}/edit.png"> 
								</a>
							</li>
							<li>
								<a title="View" href="javascript:getPositionDetails('${applicationScope.contextPath}','positionSelectBoxId')">
									<img src="${imagePath}/view.png"> 
								</a>
							</li>							
						</ul>
					</div>
					<br>
					<fieldset class="grey-bg">
						<legend>
							<a href="#">Please Select Existing Position</a>
						</legend>
						<div class="float-left gutter-right">
							<span class="label">Position</span>
							<select id="positionSelectBoxId" name="positionId">
								<c:forEach var="position" items="${positionList}">
									<option value="${position.positionId}">
										${position.positionName}
									</option>
								</c:forEach>
							</select>
						</div>
						<div class="float-left gutter-right">
							<span class="label">&nbsp;&nbsp;</span>
							<input value="Edit" class="button" type="button" onclick="getPositionDetails('${applicationScope.contextPath}','positionSelectBoxId')" />
						</div>
					</fieldset>
					<form:form action="savePosition.ems" method="POST" commandName="position">
						<div class="no-margin">
							<table class="table" width="100%">
								<tbody>
									<tr>
										<td width="120">
											Position Name
										</td>
										<td>
											<form:hidden path="positionId" />
											<form:input path="positionName" maxlength="50" />
											&nbsp;
										</td>
									</tr>
									<tr>
										<td>
											Abbreviation
										</td>
										<td>
											<form:input path="abbriviation" maxlength="10" />
										</td>
									</tr>
									<tr>
										<td>
											Position From Date
										</td>
										<td>
											<div class="calendarContainer">
												<form:input path="formDate" />
											</div>
										</td>
									</tr>
									<tr>
										<td>
											Position To Date
										</td>
										<td>
											<div class="calendarContainer">
												<form:input path="toDate" />
											</div>
										</td>
									</tr>
									<tr>
										<td>
											Position Description
										</td>
										<td>
											<form:textarea path="positionDescription" rows="2" cols="20"
												cssStyle="height: 100px; width: 100%;" />
										</td>
									</tr>
									<tr>
										<td>
											&nbsp;
										</td>
										<td>
											<c:choose>
												<c:when test="${requestScope.position.positionId == 0}">
													<input value="Save" class="button" type="submit">
												</c:when>
												<c:otherwise>
													<input value="Update" class="button" type="submit">
													&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
													<input value="Delete" class="button" type="button" onclick="deletePosition('${applicationScope.contextPath}','${requestScope.position.positionId}')">
												</c:otherwise>
											</c:choose>											
										</td>
									</tr>
								</tbody>
							</table>
						</div>
					</form:form>
				</div>
			</div>
		</div>
	</div>
</div>